<template>
  <div class="">
    <div class="left">
      <button @click="active = 0">A</button>
      <button @click="active = 1">B</button>
    </div>
    <div class="right">
      <component :is="comList[active]"></component>
    </div>
  </div>
</template>

<script>
import componentA from "@/components/compa.vue";
import componentB from "@/components/compb.vue";
export default {
  name: "",
  components: {
    componentA,
    componentB,
  },
  props: {},
  data() {
    return {
      active: 0,
      comList: ["componentA", "componentB"],
      active: 0,
    };
  },
  computed: {},
  methods: {},
  created() {},
  mounted() {},
};
</script>
<style lang='scss' scoped>
</style>